<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>Row Editing in DataGrid - jQuery EasyUI Demo</title>
    <link rel="stylesheet" type="text/css" href="./jquery-easyui/themes/default/easyui.css">
    <link rel="stylesheet" type="text/css" href="./jquery-easyui/themes/icon.css">
    <link rel="stylesheet" type="text/css" href="./jquery-easyui/themes/color.css">
    <link rel="stylesheet" type="text/css" href="./jquery-easyui/demo.css">
    <link rel="stylesheet" type="text/css" href="css/common.css">
    <script type="text/javascript" src="./jquery-easyui/js/jquery.min.js"></script>
    <script type="text/javascript" src="./jquery-easyui/js/jquery.easyui.min.js"></script>
    <script type="text/javascript" src="./js/common/common.js"></script>
    <script type="text/javascript" src="./js/common/url.js"></script>
    <script type="text/javascript" src="./js/common/loader.js"></script>
    <script type="text/javascript ">
    var url;
    var dialog;
    var datagr;
    var formData;

    function newUser() {
        $('#dlg').dialog('open').dialog('center').dialog('setTitle', '添加年月');
        $('#fm').form('clear');
        url = url_addDate;
        dialog = $('#dlg');
        datagr = $('#tt');
        formData = $('#fm')
    }

    function editJe() {
        $('#dlg_je').dialog('open').dialog('center').dialog('setTitle', '设置金额');
        $('#fm_je').form('clear');
        dialog = $('#dlg_je');
        datagr = $('#money');
        formData = $('#fm_je')
        url = url_addJe;
    }

    function saveUser() {
        var data = formData.serializeObject();
        if (formData.form('validate')) {
            $.ajax({
                type: "POST",
                url: url,
                data: JSON.stringify(data),
                contentType: "application/json; charset=utf-8",
                dataType: 'json',
                xhrFields: {
                    withCredentials: true
                },
                crossDomain: true,
                success: function(result) {
                    if (result.status == 1) {
                        dialog.dialog('close'); // close the dialog
                        datagr.datagrid('reload'); // reload the user data
                    } else {
                        $.messager.show({ // show error message
                            title: 'Error',
                            msg: result.message
                        });
                    }
                }
            })
        };

    }

    function destroyUser() {
        var row = $('#tt').datagrid('getSelected');
        console.log(row);
        if (row) {
            $.messager.confirm('确认', '你确定要删除该日期吗？', function(r) {
                if (r) {
                    var query = {
                        id: row.id
                    }
                    $.ajax({
                        type: "POST",
                        url: url_delDate + "?id=" + row.id,
                        // data: JSON.stringify(query),
                        contentType: "application/json; charset=utf-8",
                        dataType: 'json',
                        xhrFields: {
                            withCredentials: true
                        },
                        crossDomain: true,
                        success: function(result) {
                            if (result.status == 1) {
                                $('#tt').datagrid('reload'); // reload the user data
                            } else {
                                $.messager.show({ // show error message
                                    title: 'Error',
                                    msg: result.errorMsg
                                });
                            }
                        }
                    })
                }
            });
        }
    }
    $(function() {
        $('#tt').datagrid({
            title: '添加月份，编辑月份',
            iconCls: 'icon-edit',
            width: "100%",
            // height: 300,
            singleSelect: true,
            idField: 'id',
            loader: dloader,
            url: 'http://115.29.136.190:8080/help/usr/date/getAll.do',
            method: 'get',
            columns: [
                [{
                    field: 'helpYear',
                    title: '年',
                    align: 'center',
                    width: "50%"
                }, {
                    field: 'helpMonth',
                    title: '月',
                    align: 'center',
                    width: "50%"
                }]
            ],
            toolbar: '#toolbar'
        });
        $('#money').datagrid({
            title: '金额设置',
            iconCls: 'icon-edit',
            width: "50%",
            // height: 300,
            singleSelect: true,
            idField: 'id',
            loader: jloader,
            url: 'http://115.29.136.190:8080/help/mgr/je/get.do',
            method: 'post',
            columns: [
                [{
                    field: 'je',
                    title: '金额',
                    align: 'center',
                    width: "100%"
                }]
            ],
            toolbar: '#moneytl'
        });
        $('#year_c').combobox({
            valueField: 'helpYear',
            textField: 'helpYear',
            width: 200,
            data: [{
                "helpYear": 2013,
            }, {
                "helpYear": 2014,
            }, {
                "helpYear": 2015,
            }, {
                "helpYear": 2016,
            }, {
                "helpYear": 2017,
            }]
        })
    });
    </script>
</head>

<body>
    <!-- <h2>日期管理</h2> -->
    <!-- <p></p> -->
    <div id="toolbar">
        <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="newUser()">添加</a>
        <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-remove" plain="true" onclick="destroyUser()">删除</a>
    </div>
    <!-- 月份信息表格 -->
    <table id="tt" style="max-height: 400px;margin-bottom:20px;"></table>
    <!-- 金额 -->
    <div id="moneytl">
        <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-edit" plain="true" onclick="editJe()">编辑金额</a>
    </div>
    <div style="margin-top: 10px">
        <table id="money"></table>
    </div>
    <!-- 添加年月对话框 -->
    <div id="dlg" class="easyui-dialog" style="width:500px" closed="true" buttons="#dlg-buttons">
        <form id="fm" method="post" novalidate style="margin:0;padding:20px 50px">
            <div style="margin-bottom:20px;font-size:14px;border-bottom:1px solid #ccc">添加月份</div>
            <div style="margin-bottom:10px">
                <!--     <span>年:</span>
                <input id='year_c' name='helpYear' value=""> -->
                <input name="helpYear" class="easyui-textbox" required="true" label="年" style="width:100%">
            </div>
            <div style="margin-bottom:10px">
                <!--  <span>月:</span>
                <input id='month_c' name='helpMonth' value=""> -->
                <input name="helpMonth" class="easyui-textbox" required="true" label="月" style="width:100%">
            </div>
        </form>
    </div>
    <div id="dlg-buttons">
        <a href="javascript:void(0)" class="easyui-linkbutton c6" iconCls="icon-ok" onclick="saveUser()" style="width:90px">Save</a>
        <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-cancel" onclick="javascript:$('#dlg').dialog('close')" style="width:90px">Cancel</a>
    </div>
    <!-- 编辑金额 对话框-->
    <div id="dlg_je" class="easyui-dialog" style="width:500px" closed="true" buttons="#dlg-buttons">
        <form id="fm_je" method="post" novalidate style="margin:0;padding:20px 50px">
            <div style="margin-bottom:20px;font-size:14px;border-bottom:1px solid #ccc">编辑最大金额</div>
            <div style="margin-bottom:10px">
                <!--     <span>年:</span>
                <input id='year_c' name='helpYear' value=""> -->
                <input name="je" class="easyui-textbox" required="true" label="金额" style="width:100%">
            </div>
           
        </form>
    </div>
    <div id="dlg-buttons">
        <a href="javascript:void(0)" class="easyui-linkbutton c6" iconCls="icon-ok" onclick="saveUser()" style="width:90px">Save</a>
        <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-cancel" onclick="javascript:$('#dlg').dialog('close')" style="width:90px">Cancel</a>
    </div>
</body>

</html>
